<style>

    #nik { width: 25em; }
    #lblname2{width:25em;}
	#period{width:25em; }
 </style>
	<script>
   var nama;
    
	$(function() {
		function log( message ) {
			$( "<div/>" ).text( message ).prependTo( "#log" );
			$( "#log" ).scrollTop( 0 );
		}
		$( "#nik" ).autocomplete({
			source: function( request, response ) {
				$.ajax({
					url: "<?=base_url();?>index.php/target/downline_read",
					dataType: "json",
				    type: 'POST',
                    data: request,
                        success: function( data ) {
						response( $.map( data, function( item ) {
							return {
								label: item.nik +"\t|\t"+item.user_name, //+ (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
								value: item.nik,
                                usr_group:item.user_group_id,
                                name:item.user_name
							}
						}));
					}
				});
			},
            ////this is wrong
			minLength: 2,
			select: function( event, ui ) {	
			       //  $("#nik").val(ui.item.user_group);
                   $('#lblname').show();
                   $('#lblname2').show();
				    $('#lblperiod').show();
                   $('#divperiod').show();
				     $('#lblstart').show();
                   $('#divstart').show();
                   $('#lblname2').val(ui.item.name);
                    populateKPI(ui.item.usr_group);
			},
			open: function() {
				$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
			},
			close: function() {
				$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
			}
		});
	});
    
     function populateKPI(user_group){
        var kpi_target;
            $("#table").show();
            $(".wide").empty();
          $.ajax({
                    url: "<?php echo base_url(); ?>index.php/target/kpi_read/"+user_group,
                    dataType:"json",
                    success:function(data){
                    kpi_target = 0;
                    $.each(data, function(i,n){
                            //document.write(n['iccid']);
                            add_tuple = "<tr id='new_tuple"+n["kpi_code"]+"' class='wide' style='padding:5px'>"+
                                            "<td><label for='lbl"+n["kpi_code"]+"'>"+n["kpi_code"]+"</label></td>"+
                                             "<td><label for='desc"+n["kpi_code"]+"'>"+n["kpi_description"]+"</label></td>"+
                                            "<td><div class'input'><input type='desc' id='"+n["kpi_code"]+"' name='"+n["kpi_code"]+"' class='medium' style='text-align:right;'/> "+n["remark"]+" </div> Sisa Alokasi = "+n["unallocated_target"]+" <br /></td>" +
                                           "</tr>";
                            $('#table-updateable').append(add_tuple);
                            
                        });
                    },
                    error: function(data){
                        
                    }
                });  
    }
	</script>




<div class="box">
        <!-- box / title -->
        <div class="title">
                <h5>Persetujuan Target</h5>
                <ul class="links">
                        <!-- <li><a href="<?=base_url()."index.php/".$this->uri->segment(1)."/".$this->uri->segment(2)?>/new">Target Baru</a></li>
                        <li><a href="<?=base_url()."index.php/".$this->uri->segment(1)?>">Tabel Data</a></li> -->
                </ul>
        </div>
        <!-- end box / title -->
        
        <?php if($this->uri->segment(3)=="update"){?>
        <?php
        #### tampilkan alert jika terdapat kesalahan dalam memasukkan data
                $salah = validation_errors();
                if($salah <> ""){
                        echo'<div id="box-messages">
                                <div class="messages">
                                        <div id="message-error" class="message message-error">
                                                <div class="image">
                                                        <img src="'. base_url() .'file/shell/smooth/resources/images/icons/error.png" alt="Error" height="32" />
                                                </div>
                                                <div class="text">
                                                        <h6>Terdapat kesalahan dalam memasukkan data:</h6>
                                                        <span>'. validation_errors() .'</span>
                                                </div>
                                                <div class="dismiss">
                                                        <a href="#message-error"></a>
                                                </div>
                                        </div>
                                </div>
                        </div>';
                }
        ?>
        
                <form id="form" action="<?=$_SERVER['PHP_SELF']?>" method="post">
                <div class="form">
                        <div class="fields">
                                <div class="field">
                                        <div class="label">
                                                <label for="lblnik">NIK:</label>                                        
                                        </div>
                                        <div class="input" >
                                                <input type="text" id="nik" name="nik" value="<?=$data['nik']?>" class="medium" />
                                        </div>
                                        <div style="clear:both;padding: 5px;"></div>
                                        <div id="lblname" class="label" style="float: left;display:none;">
                                               
                                                <label for="lblname"  >Nama:</label> 
                                        </div>
                                        
										<div style="" class="input">
                                            <input type="text" id="lblname2" name="lblname2" class="medium" readonly="true" style="display: none;" />
                                        </div>
                                        
										<div style="clear:both;padding: 5px;"></div>
                                        <div id="lblperiod" class="label" style="float: left; display:none;">
                                               
                                                <label for="lblperiod"  >Periode (Bulan):</label> 
                                        </div>
                                        
                                        <div style="display:none;" class="input" id="divperiod">
                                            <input type="text" id="period" name="period" class="medium" value="<?=$data['period']?>" />                 
                                        </div>
										
										<div style="clear:both;padding: 5px;"></div>
                                        <div id="lblstart" class="label" style="float: left; display:none;">
                                               
                                                <label for="lblstart"  >Berlaku Mulai:</label> 
                                        </div>
                                        
                                        <div style="display:none;" class="input" id="divstart">
											<select name="start" id="start">
												<?php 
													$y=date('Y');
													$m=date('m')+1;
													$bln["01"]="Januari";
													$bln["02"]="Februari";
													$bln["03"]="Maret";
													$bln["04"]="April";
													$bln["05"]="Mei";
													$bln["06"]="Juni";
													$bln["07"]="Juli";
													$bln["08"]="Agustus";
													$bln["09"]="September";
													$bln["10"]="Oktober";
													$bln["11"]="November";
													$bln["12"]="Desember";
													for($i=1;$i<=6;$i++){
														
															if ($m <10)
																$m="0".$m;
														echo "<option value=". $y.$m .">".$bln[$m]." ". $y ."</option>";
														if($m==12){
															$y++;
															$m="01";
														} else {
															$m++;
														}
													}
												?>
											</select>              
                                        </div>
										
										<div id="table" style="clear: both; padding: 5px;">
                                            <table id="table-updateable" width="100%" style="padding: 5px;"></table>
                                        </div>

                                </div>
                                <div class="buttons" style="clear: both;">
                                        <input type="submit" name="submit" value="Save" />
                                        <input type="reset" name="reset" value="Reset" onclick="$('#lblname').hide();$('#lblname2').hide();$('#table').hide(); $('.wide').empty();" />
                                </div>
                        </div>
                </div>
                </form>
        <?php } elseif ($this->uri->segment(3)=="update"){
          ?>
            <form id="form" action="<?=$_SERVER['PHP_SELF']?>" method="post">
                <div class="form">
                <input type="hidden" name="target_id" value="<?=$data['target_id']?>" />
                        <div class="fields">
                                <div class="field">
                                        <div class="label">
                                                <label for="lblnik">NIK:</label>                                        
                                        </div>
                                        <div class="input" >
                                                <input type="text" id="nik" name="nik" value="<?=$data['nik']?>" class="medium" readonly="true" />
                                        </div>
                                        <div style="clear:both;padding: 5px;"></div>
                                        <div id="lblname" class="label" style="float: left;">
                                               
                                                <label for="lblname"  >Nama:</label> 
                                        </div>
                                        
                                        <div style="" class="input">
                                            <input type="text" id="lblname2" name="lblname2" class="medium" readonly="true" value="<?=$data['user_name']?>" />                 
                                        </div>
										
                                            <div id="table" style="clear: both; padding: 5px;">
                                                <table id="table-updateable" width="100%" style="padding: 5px;">
                                                    <tr>
                                                        <td><?=$data['kpi_code']?> </td>
                                                        <td><?=$data['kpi_description']?></td>
                                                        <td> <input type="text" id="kpi_target" name="kpi_target" class="medium" value="<?=$data['kpi_target'];?>" /> Sisa Alokasi = <?=$data['allocated'];?> <br /> </td>
                                                    </tr>
                                                </table>
                                            </div>
                                </div>
                                <div class="buttons" style="clear: both;">
                                        <input type="submit" name="submit" value="Update" />
                                </div>
                        </div>
                </div>
                </form>
          <?php
        } elseif ($this->uri->segment(3)=="approveForm"){ ?>
            <form id="form" action="<?=$_SERVER['PHP_SELF']?>" method="post">
                <div class="form">
                
                        <div class="fields">
                                
                                <div class="field">
                                    <div class="label">
                                       <label>Kode KPI  : <?=$data['unapprovedTarget'][0]['kpi_code']?></label> </br>
                                       <label>Deskripsi : <?=$data['unapprovedTarget'][0]['kpi_description']?></label> </br>
                                       <label>Bulan : <?=$data['unapprovedTarget'][0]['month']?></label> </br>
                                       <label>Tahun : <?=$data['unapprovedTarget'][0]['year']?></label> </br>
                                    </div>
                                    <div style="clear:both;padding: 30px;"></div>
                                    <div >
                                        <table >
                                        <?php foreach ($data['unapprovedTarget'] as $key=>$val) {?>                                       
                                            <tr id='row' >
                                                <td width='10%'><label for='desc-<?=$val['target_id']?>'> <?=$val["nik"]?> </label></td>
                                                <td width='40%'><label for='name-<?=$val['target_id']?>'> <?=$val["user_name"]?> </label></td>
                                                <td><div class='input'><input type='text' id='<?=$val['target_id']?>' name='<?=$val['target_id']?>' class='medium' style='text-align:right;' value='<?=$val['kpi_target']?>'/>  </div></td>
                                            </tr>
                                       <?php } ?>
                                        </table>
                                    </div>
                                </div>
                                <div class="buttons" style="clear: both;">
                                        <input type="submit" name="submit" value="Update" />
                                </div>
                        </div>
                </div>
                </form>              
              
        <?php }?>
        
        <?php
        $msg = $this->session->flashdata('message');
        if($msg <> ""){
              echo'<div id="box-messages">
                        <div class="messages">
                                <div id="message-success" class="message message-success">
                                        <div class="image">
                                                <img src="'. base_url() .'file/shell/smooth/resources/images/icons/success.png" alt="Success" height="32" />
                                        </div>
                                        <div class="text">
                                                <h6>'. $msg .'</h6>
                                        </div>
                                        <div class="dismiss">
                                                <a href="#message-success"></a>
                                        </div>
                                </div>
                        </div>
                </div>';
        }
        ?>
        <div class="table">
                <base href="<?php echo base_url() ?>" />
                <div id="ajaxLoadAni">
                        <img src="file/smooth/images/ajax-loader.gif" alt="Ajax Loading Animation" />
                        <span>Loading...</span>
                </div>
                <table id="records">
                        <thead>
                                <tr>
                                        <th>No</th>
                                        <th>NIK</th>
                                        <th>Nama Karyawan</th>
                                        <th>Kode KPI</th>
                                        <th>Bulan</th>
                                        <th>Tahun</th>
                                        <th>Target</th>
                                        <th>Aksi</th>       
                                </tr>
                        </thead>
                        <tbody></tbody>
                </table>
                <?=$this->load->view("grid-target-approve");?>
        </div>
</div>